@import '../app/variables.css';

:root {
  --font-size-L: 16px;
  --font-size-XS: 14px;
}

.wrapper {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  & header {
    & h2 {
      font-weight: var(--font-weight-semi-bold);
      text-align: left;
    }
  }

  & p {
    line-height: 30px;
    font-size: var(--font-size-L);
  }

  & a {
    font-weight: var(--font-weight-bold);
    color: var(--color-link);
    text-decoration: none;
  }

  & .button {
    font-weight: var(--font-weight-bold);
    font-size: var(--font-size-L);
    letter-spacing: 0;
    line-height: 18px;
    text-transform: none;
    min-width: 0;
    width: 100%;
  }

  & > footer {
    padding: 0;
    margin-bottom: 20px;
  }
}

@media (--xSmall-viewport) {
  .wrapper {
    & p {
      font-size: var(--font-size-XS);
    }

    & .button {
      font-size: var(--font-size-XS);
    }
  }
}
